import { EnumAuditStatus } from '@/utils/api/workflow/list/type';
import { defineComponent, computed, type PropType } from 'vue';
interface WorkflowStatusProps {
    status: EnumAuditStatus;
    style?: Record<string, string | number>;
}

const statusTextMap: Map<EnumAuditStatus, string> = new Map([
    [EnumAuditStatus.UnAudited, '待审核'],
    [EnumAuditStatus.Pass, '已同意'],
    [EnumAuditStatus.Unapprove, '已拒绝'],
]);

const statusColorMap: Map<EnumAuditStatus, string> = new Map([
    [EnumAuditStatus.UnAudited, 'blue'],
    [EnumAuditStatus.Pass, 'cyan'],
    [EnumAuditStatus.Unapprove, 'red'],
]);

const AuditStatusComponent = defineComponent({
    name: 'AuditStatusComponent',
    props: {
        status: {
            type: Number as PropType<EnumAuditStatus>,
            default: 0
        },
        style: {
            type: Object as PropType<Record<string, string | number>>,
            default: () => ({})
        }
    },
    setup(props: WorkflowStatusProps) {
        const statusText = computed(() => {
            return statusTextMap.get(props.status);
        });
        const statusStyle = computed(() => {
            return {
                color: statusColorMap.get(props.status)
            };
        });
        const style = { ...props.style, ...statusStyle.value };
        return () => (
            <el-tag style={style} class="small">
                {statusText.value}
            </el-tag>

        );
    }
});
export default AuditStatusComponent;